<template>
  <div class="friendslist">
    <van-card
      v-for="item in friendslist"
      :key="item.id"
      desc="所谓交友，就是把两个不相关的世界，融合为一个世界"
      :title="item.name"
      :thumb="item.img"
      :thumb-link="'#/home/friendsinfo/'+item.id"
    />
  </div>
</template>
<script>
import { getFriendsList } from '@/api/friends.js'
export default {
  data() {
    return {
      friendslist: []
    }
  },
  created() {
    this.getFriendsList()
  },
  methods: {
    async getFriendsList() {
      const res = await getFriendsList(this.$store.state.home.friendsname)
      this.friendslist = res.data.data
    }
  }
}
</script>

<style lang="scss" scoped>
.friendslist {
  .van-card__content {
    min-height: 50px;
  }
  .van-card__thumb {
    width: 50px;
    height: 50px;
  }
  .van-card__desc {
    max-height: 33px;
    line-height: 45px;
  }
  .van-card__title {
    font-size: 16px;
    background: linear-gradient(to right, pink, skyblue);
    -webkit-background-clip: text;
    color: transparent;
  }
}
</style>